@charset "UTF-8";
/* 浮动 */
.clearfix::before, .clearfix::after {
  content: " ";
  display: table;
  clear: both;
  height: 0;
  visibility: hidden; }

.clearfix {
  *zoom: 1; }

.fl {
  float: left; }

.fr {
  float: right; }

/* 背景颜色 */
.container-bg-light {
  background-color: #F7F8FD; }

.bg-blue {
  background-color: #1e9fff; }

.bg-primary {
  background-color: #1e9fff; }

.bg-green {
  background-color: #39b54a; }

.bg-success {
  background-color: #39b54a; }

.bg-red {
  background-color: #e54d42; }

.bg-error {
  background-color: #e54d42; }

.bg-orange {
  background-color: #f37b1d; }

.bg-warning {
  background-color: #f37b1d; }

.bg-cyan {
  background-color: #1cbbb4; }

.bg-info {
  background-color: #1cbbb4; }

.bg-yellow {
  background-color: #fbbd08; }

.bg-olive {
  background-color: #8dc63f; }

.bg-purple {
  background-color: #6739b6; }

.bg-mauve {
  background-color: #9c26b0; }

.bg-pink {
  background-color: #e03997; }

.bg-brown {
  background-color: #a5673f; }

.bg-grey {
  background-color: #8799a3; }

.bg-blue-light {
  background-color: #cce6ff; }

.bg-green-light {
  background-color: #d7f0db; }

.bg-red-light {
  background-color: #fadbd9; }

.bg-orange-light {
  background-color: #fde6d2; }

.bg-yellow-light {
  background-color: #fef4d7; }

.bg-olive-light {
  background-color: #e8f4d9; }

.bg-cyan-light {
  background-color: #d2f1f0; }

.bg-purple-light {
  background-color: #e1d7f0; }

.bg-mauve-light {
  background-color: #ebd4ef; }

.bg-pink-light {
  background-color: #f9d7ea; }

.bg-brown-light {
  background-color: #ede1d9; }

.bg-grey-light {
  background-color: #e7ebed; }

.bg-white {
  background-color: #ffffff; }

.bg-black {
  background-color: #333333; }

.bg-gray {
  background-color: #f0f0f0; }

/* 字体颜色 */
.text-blue {
  color: #1e9fff; }

.text-primary {
  color: #1e9fff; }

.text-green {
  color: #39b54a; }

.text-success {
  color: #39b54a; }

.text-red {
  color: #e54d42; }

.text-error {
  color: #e54d42; }

.text-orange {
  color: #f37b1d; }

.text-warning {
  color: #f37b1d; }

.text-cyan {
  color: #1cbbb4; }

.text-info {
  color: #1cbbb4; }

.text-yellow {
  color: #fbbd08; }

.text-olive {
  color: #8dc63f; }

.text-purple {
  color: #6739b6; }

.text-mauve {
  color: #9c26b0; }

.text-pink {
  color: #e03997; }

.text-brown {
  color: #a5673f; }

.text-grey {
  color: #8799a3; }

.text-blue-light {
  color: #cce6ff; }

.text-green-light {
  color: #d7f0db; }

.text-red-light {
  color: #fadbd9; }

.text-orange-light {
  color: #fde6d2; }

.text-yellow-light {
  color: #fef4d7; }

.text-olive-light {
  color: #e8f4d9; }

.text-cyan-light {
  color: #d2f1f0; }

.text-purple-light {
  color: #e1d7f0; }

.text-mauve-light {
  color: #ebd4ef; }

.text-pink-light {
  color: #f9d7ea; }

.text-brown-light {
  color: #ede1d9; }

.text-grey-light {
  color: #e7ebed; }

.text-white {
  color: #ffffff; }

.text-black {
  color: #333333; }

.text-gray {
  color: #f0f0f0; }

/* 字体方向 */
.text-center {
  text-align: center; }

.text-top {
  text-align: top; }

.text-right {
  text-align: right; }

.text-bottom {
  text-align: bottom; }

.text-left {
  text-align: left; }

/* 字体样式 */
.font-italic {
  font-style: italic; }

.font-bold {
  font-weight: bold; }

.font-xs {
  font-size: 10px; }

.font-sm {
  font-size: 12px; }

.font-df {
  font-size: 14px; }

.font-lg {
  font-size: 16px; }

.font-xl {
  font-size: 18px; }

.font-xxl {
  font-size: 22px; }

.font-xxxl {
  font-size: 26px; }

/* 边框 */
.border {
  border: 1px solid #f0f0f0; }

/* 边框方向 */
.border-top {
  border-top: 1px solid #f0f0f0; }

.border-right {
  border-right: 1px solid #f0f0f0; }

.border-bottom {
  border-bottom: 1px solid #f0f0f0; }

.border-left {
  border-left: 1px solid #f0f0f0; }

/* 边框颜色 */
.border-blue {
  border-color: #1e9fff; }

.border-primary {
  border-color: #1e9fff; }

.border-green {
  border-color: #39b54a; }

.border-success {
  border-color: #39b54a; }

.border-red {
  border-color: #e54d42; }

.border-error {
  border-color: #e54d42; }

.border-orange {
  border-color: #f37b1d; }

.border-warning {
  border-color: #f37b1d; }

.border-cyan {
  border-color: #1cbbb4; }

.border-info {
  border-color: #1cbbb4; }

.border-yellow {
  border-color: #fbbd08; }

.border-olive {
  border-color: #8dc63f; }

.border-purple {
  border-color: #6739b6; }

.border-mauve {
  border-color: #9c26b0; }

.border-pink {
  border-color: #e03997; }

.border-brown {
  border-color: #a5673f; }

.border-grey {
  border-color: #8799a3; }

.border-blue-light {
  border-color: #cce6ff; }

.border-green-light {
  border-color: #d7f0db; }

.border-red-light {
  border-color: #fadbd9; }

.border-orange-light {
  border-color: #fde6d2; }

.border-yellow-light {
  border-color: #fef4d7; }

.border-olive-light {
  border-color: #e8f4d9; }

.border-cyan-light {
  border-color: #d2f1f0; }

.border-purple-light {
  border-color: #e1d7f0; }

.border-mauve-light {
  border-color: #ebd4ef; }

.border-pink-light {
  border-color: #f9d7ea; }

.border-brown-light {
  border-color: #ede1d9; }

.border-grey-light {
  border-color: #e7ebed; }

.border-white {
  border-color: #ffffff; }

.border-black {
  border-color: #333333; }

.border-gray {
  border-color: #f0f0f0; }

/* 边距大小 */
.margin {
  margin: 15px; }

.padding {
  padding: 15px; }

.margin-top {
  margin-top: 15px; }

.padding-top {
  padding-top: 15px; }

.margin-right {
  margin-right: 15px; }

.padding-right {
  padding-right: 15px; }

.margin-bottom {
  margin-bottom: 15px; }

.padding-bottom {
  padding-bottom: 15px; }

.margin-left {
  margin-left: 15px; }

.padding-left {
  padding-left: 15px; }

.margin-0 {
  margin: 0px; }

.margin-top-0 {
  margin-top: 0px; }

.margin-right-0 {
  margin-right: 0px; }

.margin-bottom-0 {
  margin-bottom: 0px; }

.margin-left-0 {
  margin-left: 0px; }

.padding-0 {
  padding: 0px; }

.padding-top-0 {
  padding-top: 0px; }

.padding-right-0 {
  padding-right: 0px; }

.padding-bottom-0 {
  padding-bottom: 0px; }

.padding-left-0 {
  padding-left: 0px; }

.margin-xs {
  margin: 5px; }

.margin-top-xs {
  margin-top: 5px; }

.margin-right-xs {
  margin-right: 5px; }

.margin-bottom-xs {
  margin-bottom: 5px; }

.margin-left-xs {
  margin-left: 5px; }

.padding-xs {
  padding: 5px; }

.padding-top-xs {
  padding-top: 5px; }

.padding-right-xs {
  padding-right: 5px; }

.padding-bottom-xs {
  padding-bottom: 5px; }

.padding-left-xs {
  padding-left: 5px; }

.margin-sm {
  margin: 10px; }

.margin-top-sm {
  margin-top: 10px; }

.margin-right-sm {
  margin-right: 10px; }

.margin-bottom-sm {
  margin-bottom: 10px; }

.margin-left-sm {
  margin-left: 10px; }

.padding-sm {
  padding: 10px; }

.padding-top-sm {
  padding-top: 10px; }

.padding-right-sm {
  padding-right: 10px; }

.padding-bottom-sm {
  padding-bottom: 10px; }

.padding-left-sm {
  padding-left: 10px; }

.margin-df {
  margin: 15px; }

.margin-top-df {
  margin-top: 15px; }

.margin-right-df {
  margin-right: 15px; }

.margin-bottom-df {
  margin-bottom: 15px; }

.margin-left-df {
  margin-left: 15px; }

.padding-df {
  padding: 15px; }

.padding-top-df {
  padding-top: 15px; }

.padding-right-df {
  padding-right: 15px; }

.padding-bottom-df {
  padding-bottom: 15px; }

.padding-left-df {
  padding-left: 15px; }

.margin-lg {
  margin: 20px; }

.margin-top-lg {
  margin-top: 20px; }

.margin-right-lg {
  margin-right: 20px; }

.margin-bottom-lg {
  margin-bottom: 20px; }

.margin-left-lg {
  margin-left: 20px; }

.padding-lg {
  padding: 20px; }

.padding-top-lg {
  padding-top: 20px; }

.padding-right-lg {
  padding-right: 20px; }

.padding-bottom-lg {
  padding-bottom: 20px; }

.padding-left-lg {
  padding-left: 20px; }

.margin-xl {
  margin: 25px; }

.margin-top-xl {
  margin-top: 25px; }

.margin-right-xl {
  margin-right: 25px; }

.margin-bottom-xl {
  margin-bottom: 25px; }

.margin-left-xl {
  margin-left: 25px; }

.padding-xl {
  padding: 25px; }

.padding-top-xl {
  padding-top: 25px; }

.padding-right-xl {
  padding-right: 25px; }

.padding-bottom-xl {
  padding-bottom: 25px; }

.padding-left-xl {
  padding-left: 25px; }

.margin-xxl {
  margin: 30px; }

.margin-top-xxl {
  margin-top: 30px; }

.margin-right-xxl {
  margin-right: 30px; }

.margin-bottom-xxl {
  margin-bottom: 30px; }

.margin-left-xxl {
  margin-left: 30px; }

.padding-xxl {
  padding: 30px; }

.padding-top-xxl {
  padding-top: 30px; }

.padding-right-xxl {
  padding-right: 30px; }

.padding-bottom-xxl {
  padding-bottom: 30px; }

.padding-left-xxl {
  padding-left: 30px; }

.margin-xxxl {
  margin: 35px; }

.margin-top-xxxl {
  margin-top: 35px; }

.margin-right-xxxl {
  margin-right: 35px; }

.margin-bottom-xxxl {
  margin-bottom: 35px; }

.margin-left-xxxl {
  margin-left: 35px; }

.padding-xxxl {
  padding: 35px; }

.padding-top-xxxl {
  padding-top: 35px; }

.padding-right-xxxl {
  padding-right: 35px; }

.padding-bottom-xxxl {
  padding-bottom: 35px; }

.padding-left-xxxl {
  padding-left: 35px; }

/* 圆角大小 */
.round {
  border-radius: 2000px; }

.radius {
  border-radius: 15px; }

.radius-0 {
  border-radius: 0px; }

.radius-xs {
  border-radius: 5px; }

.radius-sm {
  border-radius: 10px; }

.radius-df {
  border-radius: 15px; }

.radius-lg {
  border-radius: 20px; }

.radius-xl {
  border-radius: 25px; }

.radius-xxl {
  border-radius: 30px; }

.radius-xxxl {
  border-radius: 35px; }
